<template>
	<!-- <view style="width: 100%;height: 100%;"> -->
	<scroll-view class="containter">
		<view class="body">
			<view style="display: flex;flex-direction: row;" @click="gotothisshop(orderinfo.shopid,orderinfo.shopname)">
			<text class="shopname" v-model="orderinfo">{{orderinfo.shopname}}</text><text style="margin-top: 15px;margin-left: -5px;width: 12px;height: 12px; background-repeat: no-repeat;" class="t-icon t-icon-youjiantou"></text>
			</view>
			
			<view v-for="item in orderinfo.detailProducts" class="items">
				<view class="item">	
					<view class="itemhead">
						<view>
							<image v-bind:src="item.productpic" style="width: 50px;height: 50px;border-radius: 8px;"></image>
						</view>
						<view class="itemstr">
							<text class="thingname">{{item.productname}}</text>
							<text class="count">x {{item.productcount}}</text>
						</view>
					</view>

					<text class="renminbi">￥</text><text class="thisrowprice">{{chengfa(item.productprice,item.productcount)}}</text>
					
				</view>	
					<text style="display: none;">{{item.productid}}</text><br>
		</view>
		
			<view class="xiaojibody">
				<view  class="xiaojititle">
					<text class="str">实付￥</text><text v-model="orderinfo" class="xiaoji">{{orderinfo.totalprice}}</text>
				</view>
				
			</view>
		
		</view>
	
		<view class="personalinfo">
			
			<view class="peisongxinxi">
				<text class="peisonghead" >配送信息</text>
			</view>
			<view class="peisongxinxi">
				<text class="common">送达时间</text>
				
				<view class="info">
					<text class="infoitem">尽快送达</text>
				</view>
				
			</view>
			
			<view class="shouhuodizhi">
				<text  class="common2">收货地址</text>
				<view class="dizhi">
					<text class="infoitem" v-model="orderinfo">{{orderinfo.address}}</text><br>
					<text class="infoitem" v-model="orderinfo">{{orderinfo.sendtowho}}  {{orderinfo.phone}}</text>
				</view>
			</view>
			
			<view class="peisongxinxi">
				<text  class="common">配送方式</text>
				<view class="info">
					<text class="infoitem">蓝骑士专送</text>
				</view>
			</view>

		</view>
		
		
		<view class="personalinfo">
			
			<view class="peisongxinxi">
				<text class="peisonghead" >订单信息</text>
			</view>
			<view class="peisongxinxi">
				<text class="common">订单号</text>
				
				<view class="info">
					<text class="infoitem" v-model="EAorderid">{{EAorderid}}</text>
				</view>
				
			</view>
	
			<view class="peisongxinxi">
				<text  class="common">下单时间</text>
				<view class="info">
					<text class="infoitem" v-model="orderinfo">{{orderinfo.createtime}}</text>
				</view>
			</view>
			
		</view>
		
		<view  v-if="havepayed" style="margin-top: 20px;margin-bottom: 20px;">
			<button type="default" style="height: 40px; width: 100px;" @click="gotopay(orderid)">去支付</button>
		</view>
		
		<view v-if="haveget" style="margin-top: 20px;margin-bottom: 20px;">
			<button type="primary" style="height: 40px; width: 100px;" @click="ihaveget(orderid)">我要收货</button>
			
		</view>
		
	</scroll-view>
	<!-- </view> -->
</template>

<script>
	export default{
	
		data(){
			return{
				orderinfo:"",
				orderid:"",
				EAorderid:"",//显示的订单号（简化）
				havepayed:false,
				haveget:false,
				
				// 生成订单信息用：
				shopname:"",
				totalprice:"",
			}
		},
		onLoad(option) {
			this.orderid=option.orderid
			
		},
		onShow() {
			
			uni.request({
				url:getApp().globalData.http+"/order/currentorder",
				method:"GET",
				header:{
					'Authorization' : uni.getStorageSync("token")
				},
				data:{
					orderid:this.orderid
				},
				success: (res) => {
					this.orderinfo=res.data
					this.EAorderid=this.orderid.substring(24)
					
					// 生成支付宝订单用：
					this.shopname=res.data.shopname
					this.totalprice=res.data.totalprice
					if(res.data.state=="待支付"){
						this.havepayed=true
					}
					else if(res.data.state=="已送出"){
						this.haveget=true
					}
				
					
					else{
						this.havepayed=false
						this.haveget=false
					}
					
					
				}
			})
		},
		computed:{
			chengfa(a,b){
				return function(arg1, arg2) {
					
					arg2=arg2+".00"
					var m = 0;
					var s1 = arg1.toString();
					var s2 = arg2.toString();
					try {
						m += s1.split(".")[1].length;
					} catch (e) {}
					try {
						m += s2.split(".")[1].length;
					} catch (e) {}
				 
					return Number(s1.replace(".", "")) * Number(s2.replace(".", "")) / Math.pow(10, m);
				}
			}
			
		},
		methods:{
			gotothisshop(shopid,shopname){
				uni.navigateTo({
					url:"../index/shopdetail/everyshop?shopuuid="+shopid+"&shopname="+shopname
				})
			},
			gotopay(orderid){
				// uni.navigateTo({
				// 	url:
				// })
				
				// uni.request({
				// 	url:"alipayqr://platformapi/startapp?saId=10000007",
				// 	method:"GET"
				// });
				
				uni.navigateTo({
					url:"../index/shopdetail/pay?orderid="+orderid+"&fromwhere=currentorder&shopname="+this.shopname+"&totalprice="+this.totalprice
				});
				
				
				//拉起支付宝扫码
				 // plus.runtime.launchApplication( {  
				 //                    action:"alipayqr://platformapi/startapp?saId=10000007"})
									
				// alipayqr://platformapi/startapp?saId=09999976	
								// weixin://RnUbAwvEilb1rU9g9yBU
			},
			ihaveget(orderid){
				uni.request({
					url:getApp().globalData.http+"/order/haveget",
					method:"POST",
					header:{
						"Authorization":uni.getStorageSync("token"),
						'content-type':"application/x-www-form-urlencoded",
					},
					data:{
						orderid:orderid
					},
					success: (res) => {
						if(res.data=="success"){
							getApp().submitorder="true"
							uni.switchTab({
								url:"./order"
							});
							uni.showToast({
								title:"收货成功"
							
							});
						}
						else{
							uni.showToast({
								title:"请稍后再试",
								icon:"none",
							});
						}
					}
					
				})
			}
			
		}

	}
</script>

<style scoped>
	.containter{
		overflow: hidden;
		width: auto;
		height: auto;
		display: flex;
		flex-direction: column;
		align-items: center;
		/* background-color: #51b3f6; */
		background-image: linear-gradient(to bottom, #51b3f6 1% , #FFFFFF 20%);
		background-position: top;
		background-size: 100% 100%;
		background-repeat: no-repeat;
		padding: 10px;
		
		/* padding-bottom: 50px; */
		
		
	}
	
	.body{
		width: 100%;
		
		height: auto;
		border-radius: 10px;
		background-color: #FFFFFF;
		margin-top: 10px;
		display: flex;
		flex-direction: column;
		align-items: flex-start;
		overflow: hidden;
		/* padding-bottom: 0px; */
		
	}
	.shopname{
		margin: 10px;
		font-size: 16px;
		font-weight: 500;
		
	}
	
	.items{
		width: 100%;
	}
	
	.item{
		display: flex;
		
		flex-direction: row;
		align-items: center;
		background-color: #FFFFFF;
		margin-bottom: -20px;
		
	}
	.itemhead{
		display: flex;
		flex-direction: row;
		margin: 10px;
		
	}
	.itemstr{
		display: flex;
		flex-direction: column;
		
		/* margin: 5px; */
	}
	.thingname{
		margin-top: -5px;
		margin-left: 10px;
		font-size: 15px;
	}
	.count{
		margin-left: 13px;
		font-size: 12px;
		margin-top: 7px;
		color: #7F7F7F;
	}
	.thisrowprice{
		font-size: 16px;
		font-weight: 600;
		margin-bottom: 3px;
		
		
	}
	.renminbi{
		font-size: 13px;
		margin-left: 55%;
		
	}
	.xiaojibody{
		border-top: #F1F1F1 0.1px solid;
		height: 60px;
		width: 100%;
		padding-left: 2px;
		padding-right: 2px;
		overflow: hidden;
		display: flex;
		flex-direction: row;
		align-items: center;
		/* background-color: #078A05; */
		
		
		
	}
	.xiaoji{
		
		/* margin-left: 80%; */
		font-size: 20px;
		font-weight: 500;
		margin-bottom: 10px;
		
		/* position: fixed; */
		
		
		
	}
	.xiaojititle{
		margin-left: 68%;
		/* position: fixed; */
	}
	.str{
		font-size: 18px;
	}
	
	.personalinfo{
		width: auto;
		height: auto;
		background-color: #FFFFFF;
		margin-top: 10px;
		border-radius: 10px;
		padding: 5px;
	}
	
	.peisongxinxi{
		background-color: #FFFFFF;
		width: 100%;
		height: auto;
		border-bottom: #F1F1F1 0.1px solid;
		align-items: center;
		display: flex;
		flex-direction: row;
		padding: 10px;
	}
	
	.peisonghead{
		font-size: 15px;
		font-weight: 600;
		background-color: #FFFFFF;
		padding-right: 30%;
		
	}
	.common{
		font-size: 15px;
		
		background-color: #FFFFFF;
		padding-right: 30%;
		
	}
	.common2{
		font-size: 15px;
		
		background-color: #FFFFFF;
		padding-right: 20%;
		
	}
	.info{
		width: 50%;
		float: right;
		background-color: #FFFFFF;
		/* margin-left: 20%; */
		
	}
	
	.infoitem{
		font-size: 15px;
		float: right;
		color: #808080;
	}
	
	.shouhuodizhi{
		background-color: #FFFFFF;
		width: 100%;
		height: 60px;
		border-bottom: #F1F1F1 0.1px solid;
		align-items: top;
		display: flex;
		flex-direction: row;
		padding: 10px;
	}
	
	.dizhi{
		width: 60%;
		float: right;
		background-color: #FFFFFF;
		
		flex-direction: column;
		
	}
</style>
